<!DOCTYPE html>
<!--指明当前的页面使用的语言环境-->
<html lang="zh-CN">
<head>
    <!--指明当前页面的字符编码格式 是  utf-8 -->
    <meta charset="utf-8">
    <!--指明当前的页面在IE浏览器渲染的时候使用最新的渲染引擎来渲染-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--标准的视口设置-->
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>黑马财富-itheima</title>
    <!-- Bootstrap -->
    <!--bootstrap 核心css文件  -->
    <link href="lib/bootstrap/css/bootstrap.css" rel="stylesheet">
    <!--
        在IE8以下都不支持 html5标签和媒体查询  引入两js插件
        html5shiv 支持HTML5标签
        respond  支持媒体查询  必须在http形式下访问才有用
     -->
    <!--[if lt IE 9]>
    <script src="lib/html5shiv/html5shiv.min.js"></script>
    <script src="lib/respond/respond.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="css/index.css"/>
</head>
<body>
    <!--顶部通栏-->
    <header class="heima_topBar hidden-sm hidden-xs">
        <div class="container">
            <div class="row">
                <div class="col-md-2">
                    <a href="#" class="heima_app">
                        <span class="heima_icon heima_icon_phone"></span>
                        <span>手机黑马财富</span>
                        <span class="glyphicon glyphicon-menu-down"></span>
                        <img src="images/code.jpg" alt=""/>
                    </a>
                </div>
                <div class="col-md-5">
                    <span class="heima_icon heima_icon_tel"></span>
                    <span>4006-618-9090（服务时间：9:00-21:00）</span>
                </div>
                <div class="col-md-2">
                    <a href="#">常见问题</a>
                    <a href="#" class="m_l10">财富登录</a>
                </div>
                <div class="col-md-3">
                    <a href="#" type="button" class="btn btn-danger btn-sm btn-register">免费注册</a>
                    <a href="#" type="button" class="btn btn-link btn-sm btn-login">登录</a>
                </div>
            </div>
        </div>
    </header>
    <!--导航栏-->
    <nav class="navbar heima_nav">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                        data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">
                    <img src="images/logo.png">
                </a>
            </div>
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="#">我要投资</a></li>
                    <li><a href="#">我要借贷</a></li>
                    <li><a href="#">平台介绍</a></li>
                    <li><a href="#">新手专区</a></li>
                    <li><a href="#">最新动态</a></li>
                    <li><a href="#">微平台</a></li>
                </ul>
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#">个人中心</a></li>
                </ul>
            </div>
        </div>
    </nav>
    <!--轮播图-->
    <div class="heima_banner ">
        <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
            <ol class="carousel-indicators"></ol>
            <div class="carousel-inner" role="listbox"></div>
            <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                <span class="sr-only">Previous</span>
            </a>
            <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                <span class="sr-only">Next</span>
            </a>
        </div>
    </div>
    <!--信息模块-->
    <div class="heima_info hidden-xs">
        <div class="container">
            <div class="row">
                <div class="col-md-4 col-sm-6">
                    <a href="#">
                        <div class="media">
                            <div class="media-left">
                                <span class="heima_icon heima_icon_E903"></span>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">支付交易保障</h4>
                                <p>银联支付全称保证支付安全</p>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-md-4 col-sm-6">
                    <a href="#">
                        <div class="media">
                            <div class="media-left">
                                <span class="heima_icon heima_icon_E901"></span>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">平台财产安全</h4>
                                <p>由PICC保驾护航</p>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-md-4 col-sm-6">
                    <a href="#">
                        <div class="media">
                            <div class="media-left">
                                <span class="heima_icon heima_icon_E900"></span>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">交易安全</h4>
                                <p>由保险公司对借款人承保</p>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-md-4 col-sm-6">
                    <a href="#">
                        <div class="media">
                            <div class="media-left">
                                <span class="heima_icon heima_icon_E904"></span>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">安全保障</h4>
                                <p>独创八层安全保障机制</p>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-md-4 col-sm-6">
                    <a href="#">
                        <div class="media">
                            <div class="media-left">
                                <span class="heima_icon heima_icon_E902"></span>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">筛选优质资产</h4>
                                <p>对接知名企业征信系统</p>
                            </div>
                        </div>
                    </a>
                </div>
                <div class="col-md-4 col-sm-6">
                    <a href="#">
                        <div class="media">
                            <div class="media-left">
                                <span class="heima_icon heima_icon_E907"></span>
                            </div>
                            <div class="media-body">
                                <h4 class="media-heading">联合信息发布</h4>
                                <p>与名企共同发布利率指数报告</p>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    <!--预约-->
    <div class="heima_book">
        <div class="container">
            <div class="pull-left">
                <span class="heima_icon heima_icon_E906"></span>
                现在有 273 人在排队，累计预约交易成功 7571 次。 什么是预约投标？
                <a class="book_link" href="#">立即预约</a>
            </div>
            <div class="pull-right hidden-xs">
                <a href="#">
                    <span class="heima_icon heima_icon_E905"></span>
                    黑马程序员企业宣传片
                </a>
            </div>
        </div>
    </div>
    <!--产品模块-->
    <div class="heima_product">
        <div class="container">
            <!-- Nav tabs -->
            <div class="nav-tabs-product-parent">
                <ul class="nav nav-tabs-product" role="tablist">
                    <li role="presentation" class="active"><a href="#product_tab_01" aria-controls="home" role="tab" data-toggle="tab">特别推荐</a></li>
                    <li role="presentation"><a href="#product_tab_02" aria-controls="profile" role="tab" data-toggle="tab">黑马投资</a></li>
                    <li role="presentation"><a href="#product_tab_03" aria-controls="messages" role="tab" data-toggle="tab">黑马投资</a></li>
                    <li role="presentation"><a href="#product_tab_04" aria-controls="settings" role="tab" data-toggle="tab">黑马投资</a></li>
                    <li role="presentation"><a href="#product_tab_05" aria-controls="profile" role="tab" data-toggle="tab">黑马投资</a></li>
                    <li role="presentation"><a href="#product_tab_06" aria-controls="messages" role="tab" data-toggle="tab">黑马投资</a></li>
                    <li role="presentation"><a href="#product_tab_07" aria-controls="settings" role="tab" data-toggle="tab">黑马投资</a></li>
                </ul>
            </div>
            <!-- Tab panes -->
            <div class="tab-content">
                <div role="tabpanel" class="tab-pane active" id="product_tab_01">
                    <div class="col-xs-12 col-sm-6 col-md-4">
                        <a href="#" class="product_box active">
                            <div class="product_box_right">
                                <p><b>8</b><sub>%</sub></p>
                                <p>年利率</p>
                            </div>
                            <div class="product_box_left">
                                <h3 class="text-center">新手体验标1002期</h3>
                                <div class="col-xs-6 text-left">
                                    <p>起投金额(元)</p>
                                    <p>0.01万</p>
                                </div>
                                <div class="col-xs-6 text-right">
                                    <p>已投标人数</p>
                                    <p>22</p>
                                </div>
                                <div class="col-xs-6 text-left">
                                    <p>借款期限</p>
                                    <p>10天</p>
                                </div>
                                <div class="col-xs-6 text-right">
                                    <p>已投标总金额(元)</p>
                                    <p>2000</p>
                                </div>
                            </div>
                        </a>
                    </div>
                    <div class="col-xs-12 col-sm-6 col-md-4">
                        <a href="#" class="product_box">
                            <div class="product_box_right">
                                <div class="toolTip_box">
                                    <span class="bao" data-toggle="tooltip" data-palcement="top" title="微金宝">宝</span>
                                    <span class="bei" data-toggle="tooltip" data-palcement="top" title="北京市">北</span>
                                </div>
                                <p><b>8</b><sub>%</sub></p>
                                <p>年利率</p>
                            </div>
                            <div class="product_box_left">
                                <h3 class="text-center">新手体验标1002期</h3>
                                <div class="col-xs-6 text-left">
                                    <p>起投金额(元)</p>
                                    <p>0.01万</p>
                                </div>
                                <div class="col-xs-6 text-right">
                                    <p>已投标人数</p>
                                    <p>22</p>
                                </div>
                                <div class="col-xs-6 text-left">
                                    <p>借款期限</p>
                                    <p>10天</p>
                                </div>
                                <div class="col-xs-6 text-right">
                                    <p>已投标总金额(元)</p>
                                    <div class="progress">
                                        <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
                                            <span class="sr-only">60% Complete</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </div>
                    <div class="col-xs-12 col-sm-6 col-md-4">
                        <a href="#" class="product_box">
                            <div class="product_box_right">
                                <p><b>8</b><sub>%</sub></p>
                                <p>年利率</p>
                            </div>
                            <div class="product_box_left">
                                <h3 class="text-center">新手体验标1002期</h3>
                                <div class="col-xs-6 text-left">
                                    <p>起投金额(元)</p>
                                    <p>0.01万</p>
                                </div>
                                <div class="col-xs-6 text-right">
                                    <p>已投标人数</p>
                                    <p>22</p>
                                </div>
                                <div class="col-xs-6 text-left">
                                    <p>借款期限</p>
                                    <p>10天</p>
                                </div>
                                <div class="col-xs-6 text-right">
                                    <p>已投标总金额(元)</p>
                                    <p>2000</p>
                                </div>
                            </div>
                        </a>
                    </div>
                    <div class="col-xs-12 col-sm-6 col-md-4">
                        <a href="#" class="product_box">
                            <div class="product_box_right">
                                <p><b>8</b><sub>%</sub></p>
                                <p>年利率</p>
                            </div>
                            <div class="product_box_left">
                                <h3 class="text-center">新手体验标1002期</h3>
                                <div class="col-xs-6 text-left">
                                    <p>起投金额(元)</p>
                                    <p>0.01万</p>
                                </div>
                                <div class="col-xs-6 text-right">
                                    <p>已投标人数</p>
                                    <p>22</p>
                                </div>
                                <div class="col-xs-6 text-left">
                                    <p>借款期限</p>
                                    <p>10天</p>
                                </div>
                                <div class="col-xs-6 text-right">
                                    <p>已投标总金额(元)</p>
                                    <p>2000</p>
                                </div>
                            </div>
                        </a>
                    </div>
                </div>
                <div role="tabpanel" class="tab-pane" id="product_tab_02"></div>
                <div role="tabpanel" class="tab-pane" id="product_tab_03"></div>
                <div role="tabpanel" class="tab-pane" id="product_tab_04"></div>
                <div role="tabpanel" class="tab-pane" id="product_tab_05"></div>
                <div role="tabpanel" class="tab-pane" id="product_tab_06"></div>
                <div role="tabpanel" class="tab-pane" id="product_tab_07"></div>
            </div>
        </div>
    </div>
    <!--新闻模块-->
    <div class="heima_news">
        <div class="container">
            <div class="row">
                <div class="col-md-2 col-md-offset-2">
                    <div class="news_title">全部新闻</div>
                </div>
                <div class="col-md-1">
                    <div class="news_line hidden-sm hidden-xs"></div>
                    <!-- Nav tabs -->
                    <ul class="nav nav-tabs-news" role="tablist">
                        <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab"><span class="heima_icon heima_icon_new01"></span></a></li>
                        <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab"><span class="heima_icon heima_icon_new02"></span></a></li>
                        <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab"><span class="heima_icon heima_icon_new03"></span></a></li>
                        <li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab"><span class="heima_icon heima_icon_new04"></span></a></li>
                    </ul>
                </div>
                <div class="col-md-7">
                    <!-- Tab panes -->
                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane active" id="home">
                            <ul>
                                <li>
                                    <a href="#">
                                        <span class="hidden-xs">2017-1-2</span> 【黑马还款】一周还款公告2017年1月18日-1月24日
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <span class="hidden-xs">2017-1-2</span> 【黑马还款】一周还款公告2017年1月18日-1月24日
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <span class="hidden-xs">2017-1-2</span> 【黑马还款】一周还款公告2017年1月18日-1月24日
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <span class="hidden-xs">2017-1-2</span> 【黑马还款】一周还款公告2017年1月18日-1月24日
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <span class="hidden-xs">2017-1-2</span> 【黑马还款】一周还款公告2017年1月18日-1月24日
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <span class="hidden-xs">2017-1-2</span> 【黑马还款】一周还款公告2017年1月18日-1月24日
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <span class="hidden-xs">2017-1-2</span> 【黑马还款】一周还款公告2017年1月18日-1月24日
                                    </a>
                                </li>
                                <li>
                                    <a href="#">
                                        <span class="hidden-xs">2017-1-2</span> 【黑马还款】一周还款公告2017年1月18日-1月24日
                                    </a>
                                </li>
                            </ul>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="profile">...</div>
                        <div role="tabpanel" class="tab-pane" id="messages">...</div>
                        <div role="tabpanel" class="tab-pane" id="settings">...</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--footer模块-->
    <footer class="heima_partner">
        <div class="container">
                <h3>合作伙伴</h3>
                <ul>
                    <li><a href="#" class="heima_icon heima_icon_partner01"></a></li>
                    <li><a href="#" class="heima_icon heima_icon_partner02"></a></li>
                    <li><a href="#" class="heima_icon heima_icon_partner03"></a></li>
                    <li><a href="#" class="heima_icon heima_icon_partner04"></a></li>
                    <li><a href="#" class="heima_icon heima_icon_partner05"></a></li>
                    <li><a href="#" class="heima_icon heima_icon_partner06"></a></li>
                    <li><a href="#" class="heima_icon heima_icon_partner07"></a></li>
                    <li><a href="#" class="heima_icon heima_icon_partner08"></a></li>
                    <li><a href="#" class="heima_icon heima_icon_partner09"></a></li>
                </ul>
        </div>
    </footer>
    <!--轮播计数器-->
    <script type="text/template" id="template_point">
        <%$.each(model,function(i,item){%>
        <li data-target="#carousel-example-generic" data-slide-to="<%=i%>" class="<%=i==0?'active':''%>"></li>
        <%});%>
    </script>
    <!--轮播图-->
    <script type="text/template" id="template_image">
        <%_.each(model,function(item,i){%>
        <div class="item <%=i==0?'active':''%>">
            <%if(isMobile){%>
            <a class="m_imageBox" href="#">
                <img src="<%=item.mb%>" alt=""/>
            </a>
            <%}else{%>
            <a class="pc_imageBox" style="background-image: url(<%=item.pc%>)"
               href="#"></a>
            <%}%>
        </div>
        <%});%>
    </script>
    <!--bootstrap是依赖jquery的-->
<script src="lib/jquery/jquery.min.js"></script>
<!--bootstrap的核心js文件-->
<script src="lib/bootstrap/js/bootstrap.js"></script>
<!--underscore-->
<script src="lib/underscore/underscore-min.js"></script>
<!--自己的js-->
<script src="js/swipe.js"></script>
<script src="js/index.js"></script>
</body>
</html>